<template>
	<view style="height: 2000rpx;">
		<!--        服务评价          -->
		<view class="pingjia">
			<view class="bianhao">
				<view>服务评价</view>
			</view>
			<view class="box-shang">
				<image src="/static/头像.jpg" mode=""></image>
				<view class="box-shang-1">
					<view>
						车百事汽车生活馆
					</view>
					<view>
						<uni-rate :touchable="false" :value="5" @change="onChange" />
					</view>
				</view>
			</view>
		</view>
		<!--     评语         -->
		<view class="pingyu">
			<view class="pingyu-1">
				<view style="
				font-weight:bold;
				font-size: 35rpx;">评语</view>
				<view style="margin: 5rpx;">(0-299字)</view>
			</view>
			<view class="box-shang-2">
				<textarea 
			placeholder="请留下您宝贵的意见和建议"
			maxlength="300"
			style="margin: 30rpx	;"
			></textarea>
			</view>
		</view>
		
		<!--     照片       -->
		<view class="zhaopian">
			<view class="pingyu-1">
				<view style="
				font-weight:bold;
				font-size: 35rpx;">照片</view>
				<view style="margin: 5rpx;">(选填)</view>
			</view>
			<view class="zhaopian-1">
				<image src="/static/加号@2x.png" mode=""></image>
			</view>
			
		</view>
		
		<!--     提交      -->
		<view class="tijiao">提交</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>
	.pingjia {
		width: 93%;
		height: 330rpx;
		background-color: #fff;
		border-radius: 30rpx;
		margin: 0 auto;
		padding: 1rpx;
	}

	.bianhao {
		border-bottom: 10rpx solid whitesmoke;
		height: 80rpx;
		margin: 30rpx;
	}

	.bianhao view {
		font-weight: bold;
		font-size: 35rpx;
	}
	.box-shang{
		padding: 1rpx;
	}
	.box-shang image {
		width: 200rpx;
		height: 150rpx;
		border-radius: 30rpx;
		float: left;
		margin-left: 30rpx;
	}
	.box-shang-1{
		float: left;
		margin: 30rpx;
	}
	.pingyu{
		width: 93%;
		height: 520rpx;
		background-color: #fff;
		border-radius: 30rpx;
		margin: 0 auto;
		padding: 1rpx;
		margin-top: 30rpx;
	}
	.pingyu-1{
		height: 60rpx;
		margin: 30rpx;
	}
	.pingyu-1 view{
		float: left;
	}
	.box-shang-2{
		margin-left: 30rpx;
		margin-right: 30rpx;
		border: 5rpx solid whitesmoke;
		border-radius: 30rpx;
	}
	.zhaopian{
		width: 93%;
		height: 370rpx;
		background-color: #fff;
		border-radius: 30rpx;
		margin: 0 auto;
		padding: 1rpx;
		margin-top: 30rpx;
	}
	.zhaopian-1{
		width: 200rpx;
		height: 200rpx;
		border: 5rpx solid whitesmoke;
		border-radius: 30rpx;
		margin-left: 30rpx;
		padding: 1rpx;
	}
	.zhaopian-1 image{
		width: 60rpx;
		height: 60rpx;
		margin:  65rpx 0 0 65rpx;
	}
	.tijiao{
		width: 65%;
		height: 80rpx;
		background-color: #55aaff;
		margin: auto;
		margin-top: 50rpx;
		text-align: center;
		line-height: 80rpx;
		border-radius: 50rpx;
		color: #fff;
		font-size: 30rpx;
	}
</style>